<template>
  <div class='car-sense'>
    <div class="tab-box">
      <Tab :listData="tabData" :selected="selectedIndex"></Tab>
    </div>

    <Scroll :hasmore="hasmore" :pullup="pullup" setHeight="-55" :top="top0">
      <List :data="listData"></List>
    </Scroll>
  </div>
</template>
<script>
import Tab from '../../common/tab'
import Scroll from '../../common/scroller'
import List from './common/list'
export default {
  components: {Tab,Scroll,List},
  name: "",
  data() {
    return {
      tabData:[
        {
          name:"养车知识",
          click:this.changeTab,
          type:0,
        },{
          name:"维修知识",
          click:this.changeTab,
          type:1,
        },
      ],
      top0:true,
      selectedIndex:0,
      selectedId:"",
      pageInfo:{
        page:1
      },

      listData:[
        // {
        //   id:1,
        //   img:require('../../../assets/img/hpmepage/sense/1.png'),
        //   info:"防冻液可以用水代替吗？别坏了才来哭诉",
        // },{
        //   id:2,
        //   img:require('../../../assets/img/hpmepage/sense/1.png'),
        //   info:"防冻液可以用水代替吗？别坏了才来哭诉",
        // },
      ],

      hasmore:false,
    };
  },
  methods: {
    changeTab(item,index){
      if(this.selectedIndex!=index){
        this.selectedIndex=index
        this.selectedId=item.id
        this.top0=!this.top0
        this.pageInfo.page=1
        this.listData=[]
        this.getList()
      }
    },

    // 获取下拉
    getSelectData(){
      _g.apiPost("knowledge/frame.do").then(res=>{
        if(res.status){
          _g.toMessage(res)
          return
        }
        var tabList=[]
        res.data.forEach((ele,index)=>{
          tabList.push({
            name:ele.name,
            click:this.changeTab,
            id:ele.id,
            type:index
          })
        })
        this.$set(this,"tabData",tabList)
        if(tabList.length>0)this.selectedId=tabList[0].id
      }).then(()=>{
        this.getList()
      })
    },

    // 下拉刷新方法回调
    pullup(func){
      if(this.hasmore){
        this.pageInfo.page++
         _g.orderList([this.getList,func])
         return
      }
    },
    getList(){
      var params={
        currPageNo:this.pageInfo.page,
        typeId:this.selectedId
      }
      _g.apiPost("knowledge/init.do",params).then(res=>{
        if(res.status){
          _g.toMessage(res)
          return
        }

        this.hasmore=res.data.msgList.hasNextPage
        var goal=[]
        res.data.msgList.list.forEach(ele => {
          goal.push({
            id:ele.id,
            img:ele.picture||"https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=530763801,912059783&fm=27&gp=0.jpg",
            info:ele.title||"暂无内容"
          })
        });
        this.$set(this,"listData",this.listData.concat(goal))
        
      })
    }
  },
  created() {
    this.getSelectData()
  },
  mounted(){

  }
};
</script>
<style lang="scss" scoped>
.car-sense {
  background-color: #fff;
  .tab-box{
    background-color: #f2f2f2;
    padding-bottom: 5px;
  }
}
</style>